<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
  export default {
    name: 'App',
    created() {
        //在页面加载时读取sessionStorage里的状态信息
        if (sessionStorage.getItem("store") ) {
          this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
        }
        //在页面刷新时将vuex里的信息保存到sessionStorage里
        window.addEventListener("beforeunload",()=>{
          sessionStorage.setItem("store",JSON.stringify(this.$store.state))
        })
      }
  }
</script>
<style lang="less">
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
}
.el-input__inner{
  background-color: #e3e1e4!important;
  color:#222!important;
  font-size:22px!important;
  font-weight: 500!important;
  height:43px!important;
  line-height:43px!important;
  border-radius: 13px!important;
}
.el-form-item{
  margin-bottom:15px!important;
}
.el-form-item__label{
  color:#333!important;
  font-weight:700;
  padding-bottom:3px!important;
  line-height:20px!important;
  margin-top: 10px;
}
.el-radio{
  width:200px;
  height:43px;
  line-height:43px!important;
}
.el-checkbox{
  width:200px;
}
.specail .el-checkbox, .specail .el-radio{
  height:25px!important;
  line-height:25px!important;
  width:150px;
}
.specail .el-input__inner{
  height:20px!important;
  line-height:20px!important;
  font-size:16px!important;
  width:150px;
}
.specail .el-checkbox{
  display:block!important;
}
.el-checkbox__label{
  color:#222!important;
  font-weight:500;
}
.el-radio__label{
  color:#222!important;
  font-weight:500;
}
@import url('./common/style.less');
</style>
